<template>
  <div>
    <h3 style="text-align: center;">查询所有已上架商品</h3>
    <el-button type="primary" size="small" @click="addPromotional">添加促销方案</el-button>
    <div style="height:250px">
      <el-table
          ref="multipleTable"
          :data="cutObj.records"
          tooltip-effect="dark"
          style="width: 100%"
          @selection-change="handleSelectionChange"
          border stripe >
        <el-table-column type="selection" width="55" prop="productName" label="商品名"/>
        <el-table-column prop="type" label="商品类型"/>
        <el-table-column prop="rate" label="折扣率"/>
        <el-table-column prop="price" label="价格"/>
        <el-table-column prop="num" label="数量"/>
      </el-table>
    </div>

    <div style="margin: 20px">
      <el-pagination
          v-model:current-page="currentPage"
          v-model:page-size="cutObj.size"
          background
          layout="prev, pager, next, jumper"
          :total="cutObj.total"
          @current-change="findProductAll"
      />
    </div>

    <el-button type="primary" size="small" @click="findByPromotional">查询所有促销订单</el-button>
<!--查询所有促销订单-->
    <el-dialog
        v-model="promotionalShow"
        title="查询所有促销订单"
        width="70%"
    >
      <el-table :data="promotionalObj">
        <el-table-column prop="number" label="促销编号"/>
        <el-table-column prop="description" label="促销方案描述"/>
        <el-table-column prop="status" label="状态"/>
        <el-table-column prop="audit" label="审核状态"/>

        <el-table-column fixed="right" label="操作">
          <template #default="scope">
            <el-button type="danger" size="small" @click="del(scope.row.promotionalId)">删除促销订单</el-button>
          </template>
        </el-table-column>
      </el-table>
      <template #footer>
    <span class="dialog-footer">
    <el-button type="primary" @click="promotionalShow = false">确定</el-button>
  </span>
      </template>
    </el-dialog>

<!--    添加促销方案弹出框-->
    <el-dialog
        v-model="showAdd"
        title="添加用户"
        width="40%">
      折扣描述：<el-input v-model="promotionalSchemeObj.description" style="width: 200px"/><br>
      折扣率：<el-input v-model="promotionalSchemeObj.rate" style="width: 200px"/><br>
      <template #footer>
    <span class="dialog-footer">
    <el-button @click="quxiao">取消</el-button>
    <el-button type="primary" @click="add">确定</el-button>
  </span>
      </template>
    </el-dialog>
  </div>
</template>

<script>

import axios from "axios";

export default {
  data() {
    return {
      showAdd:false,
      promotionalSchemeObj:{},
      status:"",
      promotionalObj:[],
      promotionalShow:false,
      cutObj: [],
      currentPage: 1,
      productIdArr:[],
    }
  }, methods: {
    findProductAll(pageNum){
      axios.get("/project/promotional/findProductAll",{
        params:{pageNum}
      }).then(resp=>{
        this.cutObj = resp.data
      })
    },
    findByPromotional(){
      this.promotionalShow = true;
      axios.get("/project/promotional/findByPromotion").then(resp=>{
        var info = resp.data
        info.forEach(n=>{
          if (n.status === 0){
            n.status = "未结束"
          }else {
            n.status = "结束"
          }
          if (n.audit === 0){
            n.audit = "待审核"
          }else if (n.audit === 1){
            n.audit = "审核通过"
          }else {
            n.audit = "审核未通过"
          }
        })
        this.promotionalObj = info
      })
    },
    handleSelectionChange(val) {
      this.productIdArr = val.map(n=>n.productId);
    },
    addPromotional(){
    this.showAdd = true;
    },
    quxiao(){
      this.promotionalSchemeObj.description= null;
      this.promotionalSchemeObj.rate= null;
      this.showAdd = false;
    },
    add(){
      let param = new FormData();
      param.append("description",this.promotionalSchemeObj.description)
      param.append("rate",this.promotionalSchemeObj.rate)
      param.append("productIdArr",this.productIdArr)
      axios.post("/project/promotional/addPromotionalProduct",param).then(resp=>{
        if (resp.data.tag==0){
          this.$message({
            message: "发送成功",
            type: "success",
            showClose: true,
          });
        }else{
          this.$message({
            message: "发送失败",
            type: "error",
            showClose: true,
          });
        }
        this.promotionalSchemeObj.description= null;
        this.promotionalSchemeObj.rate= null;
        this.showAdd = false;
      })
    },
    del(promotionalId){
      axios.get("/project/promotional/delPromotionalByProduct",{
        params:{promotionalId}
      }).then(resp=>{
        if (resp.data.tag === 0){
          this.$message({
            message: "删除成功",
            type: "success",
            showClose: true,
          });
          this.findByPromotional()
        }else {
          this.$message({
            message: "删除失败",
            type: "error",
            showClose: true,
          });
        }
      })
    },
  },
  created() {
    this.findProductAll(1);
  }
}
</script>

<style scoped>

</style>